.search-index {
    width: 100vw;
    max-width: 750px;
    /*no*/
    position: fixed;
    left: 50%;
    top: 0;
    transform: translate(-50%, 0);
    height: 90px;
    /*rem*/
    z-index: 10000;
    background-color: red;

    .am-flexbox {
        height: 100%;
    }

    .am-flexbox-item {
        flex: none;
    }

    .flex_1 {
        flex: 1;
    }
    .middle-center{
        display: flex;
        align-items: center;
    }
    .classification {
        padding: 0 10px;/*rem*/
    }

    .mine {
        padding: 0 10px;/*rem*/
    }

    .iconfont {
        font-size: 50px;
        /*rem*/
    }

    .icon-mine:before {
        content: "\e611";
    }

    .icon-search:before {
        content: "\e647";
    }

    .icon-classification:before {
        content: "\e60d";
    }

    .inputBox {
        display: flex;
        align-items: center;

        .search-input-box {
            width: 100%;
            position: relative;
            padding: 0 50px;
            /*rem*/
            box-sizing: border-box;
            background-color: #ffffff;
            border-radius: 100px;
            height: 45px;
            /*rem*/
            display: flex;
            align-items: center;

            .search-input {
                flex: 1;
                height: 45px;
                /*rem*/
                border: none;
                outline: none;
                font-size: 30px; /*rem*/
                background-color: transparent;
            }

            .icon-search {
                position: absolute;
                left: 10px;
                /*rem*/
                top: 50%;
                transform: translate(0, -50%);
                color: #cccccc;
                font-size: 40px;
                /*rem*/

            }
        }

    }

}